<template>
  <div class="container">
    <template v-if="paperFlag === '1'">
      报纸刊登已开启
      <el-button type="danger" :loading="btnLoading" @click="changePaperFlag('0')">关闭</el-button>
    </template>
    <template v-if="paperFlag === '0'">
      报纸刊登已关闭
      <el-button type="success" :loading="btnLoading" @click="changePaperFlag('1')">开启</el-button>
    </template>
  </div>
</template>

<script>
export default {
  name: 'PaperIndex',
  data() {
    return {
      paperFlag: null,
      btnLoading: false
    }
  },
  mounted() {
    this.paperFlag = localStorage.getItem('paperFlag')
  },
  methods: {
    changePaperFlag(flag) {
      let msg = ''
      if (flag === '0') {
        msg = '关闭后，无法刊登报纸信息，确认要关闭吗?'
      } else if (flag === '1') {
        msg = '确认要开启吗?'
      }
      this.$confirm(msg, '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        const para = {
          key: 'paperFlag',
          val: flag
        }
        this.btnLoading = true
        this.$http
          .post('/api/busConfig/save', para)
          .then(response => {
            this.btnLoading = false
            if (response.data.success === true) {
              localStorage.setItem('paperFlag', flag)
              this.paperFlag = flag
              this.$message({
                message: '操作成功',
                type: 'success'
              })
            } else {
              console.log('获取失败:' + response.data.message)
              this.$message({
                message: '获取失败:' + response.data.message,
                type: 'error'
              })
            }
          })
          .catch(error => {
            console.log(error)
            this.btnLoading = false
          })
      })
    }
  }
}
</script>

<style scoped>
.container{
  padding: 20px;
}
</style>
